{% extends "layout.html" %}
{% block content %}
    <div class="x-body layui-anim layui-anim-up">
        <form class="layui-form" lay-filter="form">
			<table class="layui-table">
				<tbody>
                    <tr>
						<th><span class="x-red">*</span>标签名</th>
						<td colspan="3">
                            <input type="text" id="label" name="label" required="required" lay-verify="required"
                            autocomplete="off" class="layui-input">
                        </td>
                    </tr>
                    <tr>
						<th><span class="x-red">*</span>通道</th>
						<td colspan="3">
							<select id="channel4collect" name="channel4collect" lay-filter="channel4collect" lay-search=""></select>
                        </td>
                    </tr>
                    <tr>
						<th><span class="x-red">*</span>数据点</th>
						<td colspan="3">
							<select id="dataItem" name="dataItem" lay-filter="dataItem" lay-search=""></select>
                        </td>
                    </tr>
					<tr>
						<td colspan="4" style="text-align: center;">
                            <button id="confirm" class="layui-btn" lay-filter="confirm" lay-submit="">
                                增加
                            </button>
                        </td>
					</tr>
                </tbody>
            </table>
        </form>
    </div>
    <script>
        var channel_id=GetQueryString('channel_id');
        var channel4collect_id=0;
        layui.use(['form','layer'], function(){
            $ = layui.jquery;
            var form = layui.form
            ,layer = layui.layer;
            var $=layui.jquery;
            $.ajax({
                url:"../channel4collect/channelList",
                type:"POST",
                dataType:"json",
                success:function(data){
                    $("#channel4collect").empty();
                    $.each(data.data,function(channel4collect_key,channel4collect_val){
                        if(channel4collect_val.protocol==2||channel4collect_val.protocol==5||channel4collect_val.protocol==7)
                            $("#channel4collect").append(new Option(channel4collect_val.name+"("+channel4collect_val.com+")",channel4collect_val.channel_id));
                        else
                            $("#channel4collect").append(new Option(channel4collect_val.name+"("+channel4collect_val.host_ip+":"+channel4collect_val.port+")",channel4collect_val.channel_id));
                    });
                    form.val("form",{
                        channel4collect:channel4collect_id
                    });
                    layui.form.render();
                }
            });
            function dataItem4collect_show(){
                channel4collect_id=form.val("form")["channel4collect"];
                $.ajax({
                    url:"./dataItem2channelList2",
                    type:"POST",
                    data:{
                        channel_id:channel_id,
                        channel4collect_id:channel4collect_id
                    },
                    dataType:"json",
                    success:function(data){
                        $("#dataItem").empty();
                        $.each(data.data,function(dataItem_key,dataItem_val){
                            $("#dataItem").append(new Option("标签:["+dataItem_val.label+"](地址:"+dataItem_val.address+")=["+dataItem_val.value+"]-["+dataItem_val.timestamp+"]",dataItem_val.dataItem_id));
                        });
                        layui.form.render();
                    }
                });
            }
            form.on('select(channel4collect)',function(data){
                dataItem4collect_show();
            });
            //监听提交
            form.on('submit(confirm)', function(data){
                if(channel_id==null){
                    layui.alert("错误操作");
                    return;
                }
                data.field['channel_id']=channel_id;
                $.ajax({
                    url:'add_dataItem2channel',
                    type:'POST',
                    dataType:'json',
                    data:data.field,
                    success:function(data){
                        if(data.code==0){
                            layer.alert("操作成功", {icon: 6},function () {
                                parent.location.reload();
                                // 获得frame索引
                                var index = parent.layer.getFrameIndex(window.name);
                                //关闭当前frame
                                parent.layer.close(index);
                            });
                        }else{
                            layer.msg(data.msg);
                        }
                    }
                });
                return false;
            });
        });
    </script>
{% endblock %}